<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>demo18-dom操作</title>
    <script src="http://libs.baidu.com/jquery/1.9.1/jquery.min.js"></script>
    <style>


    </style>

</head>
<body>
    <p>11111111111111</p>

    <p>我是第1个p标签</p>

    <p>我是第2个p标签</p>

    <p id="p4">我是第3个p标签</p>

    <p id="p5">我是第4个p标签</p>

    <p id="p6">我是第5个p标签</p>

    <p id="p7">我是第6个p标签</p>
    <p id="p8">我是第7个p标签</p>
    <p id="p9">我是第8个p标签</p>
    <p id="p10">我是第9个p标签</p>
    <p id="p11">我是第10个p标签</p>
    <p id="p12">我是第11个p标签</p>

</body>
</html>

<script>
    var newElement = $('<div>ccccc</div>')

    $('body').append(newElement)


//    用字符串创建
    var newE1 = '<div>我是用字符串方法创建的标签</div>';

    $('body').append(newE1)


    var strong = $('<strong>我是被插入的新标签</strong>');
    var strong1 = $('<strong>我是被插入的新标签111</strong>');


    var strong2 = $('<strong>我是被插入的外部新标签111</strong>');


    $('#p4').append(strong);

    strong.appendTo($('#p5'));  // 和上面的效果一样

    $('#p6').prepend(strong1);

//    插入到外部
    $('#p9').after(strong2);

</script>